.login {
  width: 100%;
  height: 100vh;
  padding: 0 16rpx;
  box-sizing: border-box;
  position: relative;

  .body {
    // height: 70%;
    // background-color: #f5f5f5;
    border-radius: 16rpx;
    width: 100%;
    display: flex;
    align-items: center;
    flex-direction: column;

    .top {
      width: 100%;
      height: 74%;
      display: flex;
      align-items: center;
      background-image: url('@resource/tabImg/loginBg3.svg');
      // background-image: url('@resource/tabImg/loginBgOne.png');
      background-repeat: repeat-x;
      background-position: inherit;
      margin-bottom: 20rpx;

      .loginImg {
        width: 100%;
        border-radius: 50rpx;
      }
    }

    .bottom {
      width: 100%;

      .usePhonenumber,
      .oneClickLogin {
        font-weight: bold;
        width: 80%;
        border-radius: 50rpx;
        border: none;
        font-size: 30rpx;
        height: 80rpx;
        line-height: 82rpx;
      }

      .usePhonenumber {
        background-color: #fed002;
      }

      .oneClickLogin {
        margin-top: 32rpx;
        background-color: #000002;
        color: #ffffff;
      }
    }
  }

  .footer {
    position: absolute;
    bottom: 80rpx;
    // padding: 0 16rpx;
    width: 100%;
    text-align: center;

    .desc {
      font-size: 20rpx;
      color: gray;
      text-align: center;
      display: inline-block;

      .cicrle {
        width: 30rpx;
        height: 30rpx;
        border-radius: 50%;
        display: inline-block;
        margin-right: 8rpx;
        vertical-align: bottom;

        .checkbox {
          width: 100%;
          height: 100%;
        }
      }

      .protocol {
        color: #2196F3;
      }
    }
  }
}
